<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">关于我们</el-breadcrumb-item>
      <el-breadcrumb-item>失物招领</el-breadcrumb-item>
    </el-breadcrumb>
    <div style="padding: 0 30px">
      <div class="info">
        <h3>咨询热线：</h3>
        <p style="margin: 10px 0 15px">027-88518861</p>
        <h3>领取地点：</h3>
        <p style="margin: 10px 0 15px">游客服务中心</p>
        <h3>认领须知：</h3>
        <p>
          <i>1</i
          >请失主携带相关有效证件（医保卡、驾驶证、户口本等原件或复印件）致电或现场查询
        </p>
        <p><i>2</i>需失主提供丢失时间、地点、物品特征等描述</p>
        <p><i>3</i>所有证件类（身份证、银行卡等）只公布最后4位数</p>
        <p><i>4</i>请失主本人至现场填写物品认领单后认领物品</p>
        <p>
          <i>5</i
          >委托他人领取失物时，失主应制作亲笔签名的委托书，由被委托人持本人有效证件和失主的身份证复印件及委托书到多罗碧加乐园游客中心领取失物。
        </p>
        <p>以上最终解释权归武汉多罗碧加乐园所有</p>
      </div>
      <el-table
        stripe
        border
        :data="tableData"
        :header-cell-style="{
          textAlign: 'center',
          fontSize: '16px',
          background: '#F0F5F7',
        }"
        :cell-style="{ textAlign: 'center' }"
        style="width: 100%; margin-top: 20px"
      >
        <el-table-column prop="num" label="序号" width="120"></el-table-column>
        <el-table-column prop="date" label="日期"></el-table-column>
        <el-table-column prop="things" label="拾到物品"> </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      tableData: [
        {
          num: 1,
          date: "2021-05-26",
          things: "工商银行卡（尾号7542）",
        },
        {
          num: 2,
          date: "2021-07-02",
          things: "张三身份证（尾号3212）",
        },
        {
          num: 3,
          date: "2021-07-16",
          things: "李四身份证（尾号1203）",
        },
        {
          num: 4,
          date: "2021-08-19",
          things: "王五身份证（尾号2356）",
        },
        {
          num: 5,
          date: "2021-08-27",
          things: "赵六武汉居住证（尾号294X）",
        },
        {
          num: 6,
          date: "2021-09-10",
          things: "建行银行卡（尾号970）",
        },
        {
          num: 7,
          date: "2021-09-30",
          things: "黑色短款钱包（现金210元、校园卡、银行卡等）",
        },
        {
          num: 8,
          date: "2021-10-12",
          things: "小红驾驶证",
        },
        {
          num: 9,
          date: "2021-10-31",
          things: "小明学生证",
        },
        {
          num: 10,
          date: "2021-11-23",
          things: "欧阳铁锤社保卡",
        },
        {
          num: 11,
          date: "2021-12-25",
          things: "农行银行卡（尾号7856）",
        },
        {
          num: 12,
          date: "2022-03-24",
          things: "小黑身份证（尾号2302）",
        },
        {
          num: 13,
          date: "2022-03-24",
          things: "交行银行卡（尾号3569）",
        },
      ],
    };
  },
  computed: {},
  created() {},
  mounted() {},
  methods: {},
};
</script>

<style scoped lang="scss">
::v-deep .el-breadcrumb {
  font-size: 21px;
  line-height: 2;
}

.info {
  margin-top: 20px;
  padding: 20px;
  background-color: #fafafa;

  h3 {
    color: #f68800;
  }

  p {
    color: #373737;
    margin-top: 20px;
    font-size: 15px;

    i {
      font-style: normal;
      color: #fff;
      background-color: #f68800;
      padding: 3px 9px;
      border-radius: 50%;
      margin-right: 5px;
    }
  }
}
</style>
